<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../css/mui.picker.css" />
		<link rel="stylesheet" type="text/css" href="../css/mui.poppicker.css"/>
		<style>
			ul {
				font-size: 14px;
				color: #8f8f94;
			}
			.rukumingxi{
				margin: 1rem 0 1rem 0.9rem;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav" style="padding-right: 15px;">
			<button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
				<span class="mui-icon mui-icon-left-nav"></span>
			</button>
			<h1 class="mui-title">卷验-按缸</h1>
			<button class=" mui-pull-right mui-btn-link"><span class="mui-icon mui-icon-redo"></span></button>
		</header>
		<div class="mui-content">
			<form class="mui-input-group">
			    <div class="mui-input-row">
			        <label>入库日期</label>
			    	<input type="date" class="mui-input-clear" name="rukuDate" id="rukuDate">
			    </div>
			    <div class="mui-input-row">
			        <label>仓库类别</label>
			        <input type="text" class="mui-input-clear" id="cangkuId"  placeholder="请选择仓库">
			        <input type="hidden"  id="kuweiId" name="kuweiId" value="">
			    </div>
			    <div class="mui-input-row">
			        <label>库位</label>
			        <input type="text" class="mui-input-clear" id="kuquIds" placeholder="请选择库位" readonly="readonly">
			        <input type="hidden" name="kuquId" id="kuquId" />
					<input type="hidden" name="ganghao" id="ganghao" value=""/>
			    </div>
				<div class="mui-input-row">
					<label>备注</label>
					<input type="text" class="mui-input-clear" name="memo" id="memo">
				</div>
			    <div class="mui-input-row">
			    	<label>入库信息</label>
			    </div>
				<div id="rukuData">
					<ul class="mui-table-view">
						
					</ul>
				</div>
			    <div class="mui-button-row">
			        <button type="button" class="mui-btn mui-btn-primary" id="submit">确认入库</button>
			        <button type="button" class="mui-btn mui-btn-primary" id="submit1">模拟扫码</button>
			    </div>
			</form>
		</div>
		<script src="../config.js"></script>
		<script src="../js/mui.js"></script>
		<script type="text/javascript" src="../js/mui.picker.js"></script>
		<script type="text/javascript" src="../js/mui.poppicker.js"></script>
		<script src="../js/scaner.js"></script>
		<script type="text/javascript" src="../js/jquery.1.9.1.js"></script>
		<script src="../js/app.js"></script>
		<script>
			mui.init();
			listenDelete();
			var picker = new mui.PopPicker();
			var table = document.body.querySelector('.mui-table-view');
			document.querySelector("#cangkuId").addEventListener("tap",function(){
				picker.setData(getMlCangku());
		  		picker.show(function(items){
	            	document.getElementById('cangkuId').value=items[0].value;
	            	document.getElementById('kuweiId').value=items[0].id;
	          	});
	        });
	        document.querySelector("#kuquIds").addEventListener("tap",function(){
	        	var cangkuId=document.getElementById('kuweiId').value;
	        	if(!cangkuId){
	        		mui.toast('请先选择仓库');
	        		return false;
	        	}
				picker.setData(getMlKuwei(cangkuId));
		  		picker.show(function(items){
	            	document.getElementById('kuquIds').value=items[0].value;
	            	document.getElementById('kuquId').value=items[0].id;
	          	});
	        });
	        document.querySelector("#submit1").addEventListener("tap",function(){
	        	
	        });
			 document.querySelector("#submit").addEventListener("tap",function(){
				var rukuDate=document.getElementById('rukuDate').value;
				var kuweiId=document.getElementById('kuweiId').value;
				var kuquId=document.getElementById('kuquId').value;
				var memo=document.getElementById('memo').value;
				var li=table.getElementsByClassName('mui-table-view-cell');
				var checkIdArr=[];
				for (var i=0;i<li.length;i++) {
					checkIdArr.push(li[i].getAttribute('id'));
				}
				var checkId=checkIdArr.join(',');
	         	var submitinfo={rukuDate:rukuDate,kuweiId:kuweiId,kuquId:kuquId,checkId:checkId,memo:memo};
				checkSaveByGang(submitinfo, function(err) {
					if (err) {
						plus.nativeUI.toast(err);
						return;
					}
				});
			 });
			mui.plusReady(function(){
				//initMe();
				plus.key.addEventListener('keyup',function(e){
					console.log("keyup: "+e.keyCode);
					if(e.keyCode==224){
						var result=getCode();
						var data=getGangData(result);
			            doCodeData(data,ganghao);
					}
					if(e.keyCode==4){
						mui.back();
					}
					if(e.keyCode==5){
						mui.trigger(document.getElementById('submit'),'tap');
					}
				},false);
			});
			function doCodeData(data)
			{
				mui.each(data, function(index, item) {
					if(!index){
						var result=item.c5;
						var ganghao=document.getElementById('ganghao').value;
						var gangArr=ganghao.split(',');
						var isset=$.inArray(result,gangArr);
						if(isset>=0){
							mui.alert('该缸号已扫描');
							return false;
						}
						document.getElementById('ganghao').value=ganghao+result+',';
					}
					var str = '';
					str += '<div class="mui-slider-right mui-disabled"><a class="mui-btn mui-btn-red">删除</a></div>';
					str += '<div class="mui-slider-handle">条码：'+item.orderId+'-'+item.checkId+',缸号:'+item.c5+',卷号:'+item.checkId+',长度：'+item.length+'，重量：'+item.weight+'</div>';
					var li = document.createElement('li');
					li.className = 'mui-table-view-cell';
					li.id=item.id;
					li.innerHTML = str;
					table.appendChild(li);
				});
			}
		</script>
	</body>

</html>